<div id="menu_container" class="side-menu sidebar-inverse">
    <nav class="navbar navbar-default" role="navigation">
        <div class="side-menu-container">
            <input id="menu_code" value="${code }" type="hidden">
            <input id="menu_pcode" value="${pcode }" type="hidden">
            <div class="navbar-header">
                <a class="navbar-brand" href="#">
                    <div class="icon fa fa-paper-plane"></div>
                    <div class="title">JXS-Admin V.1</div>
                </a>
                <button type="button" class="navbar-expand-toggle pull-right visible-xs">
                    <i class="fa fa-times icon"></i>
                </button>
            </div>
            <ul class="nav navbar-nav">
            	<template v-for="menu in menuList">
<!--             		#ffd04b -->
            		<template v-if="menu.childs!=null && menu.childs.length>0">
            			<li class="panel panel-default dropdown " :class="menu_code==menu.code||menu_pcode==menu.code?'active ':''">
            				<a data-toggle="collapse" :href="'#'+menu.code">
		                        <span class="icon fa" :class="menu.icon"></span>
		                        <span class="title">{{menu.name}}</span>
		                    </a>
		                    <div :id="menu.code" class="panel-collapse collapse" :class="menu_pcode==menu.code?'in ':''" >
		                        <div class="panel-body">
		                            <ul class="nav navbar-nav">
		                                <li v-for="child in menu.childs" >
		                                	<a :href="child.url" :style="{ color: (menu_code==child.code?'#ffd04b':'') }">{{child.name}}</a>
		                                </li>
		                            </ul>
		                        </div>
		                    </div>
            			</li>
            		</template>
            		<template v-if="menu.childs==null || menu.childs.length==0">
            			<li :class="menu_code==menu.code?'active ':''">
            				<a :href="menu.url">
		                        <span class="icon fa" :class="menu.icon"></span>
		                        <span class="title">{{menu.name}}</span>
		                    </a>
            			</li>
            		</template>
            	</template>
                <!-- <li >
                    <a href="index.html">
                        <span class="icon fa fa-tachometer"></span><span class="title">Dashboard</span>
                    </a>
                </li>
                <li class="panel panel-default dropdown">
                    <a data-toggle="collapse" href="#dropdown-element">
                        <span class="icon fa fa-desktop"></span><span class="title">UI Kits</span>
                    </a>
                    Dropdown level 1
                    <div id="dropdown-element" class="panel-collapse collapse">
                        <div class="panel-body">
                            <ul class="nav navbar-nav">
                                <li><a href="ui-kits/theming.html">Theming</a>
                                </li>
                                <li><a href="ui-kits/grid.html">Grid</a>
                                </li>
                                <li><a href="ui-kits/button.html">Buttons</a>
                                </li>
                                <li><a href="ui-kits/card.html">Cards</a>
                                </li>
                                <li><a href="ui-kits/list.html">Lists</a>
                                </li>
                                <li><a href="ui-kits/modal.html">Modals</a>
                                </li>
                                <li><a href="ui-kits/alert.html">Alerts & Toasts</a>
                                </li>
                                <li><a href="ui-kits/panel.html">Panels</a>
                                </li>
                                <li><a href="ui-kits/loader.html">Loaders</a>
                                </li>
                                <li><a href="ui-kits/step.html">Tabs & Steps</a>
                                </li>
                                <li><a href="ui-kits/other.html">Other</a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </li>
                <li class="panel panel-default dropdown">
                    <a data-toggle="collapse" href="#dropdown-table">
                        <span class="icon fa fa-table"></span><span class="title">Table</span>
                    </a>
                    Dropdown level 1
                    <div id="dropdown-table" class="panel-collapse collapse">
                        <div class="panel-body">
                            <ul class="nav navbar-nav">
                                <li><a href="table/table.html">Table</a>
                                </li>
                                <li><a href="table/datatable.html">Datatable</a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </li>
                <li class="panel panel-default dropdown">
                    <a data-toggle="collapse" href="#dropdown-form">
                        <span class="icon fa fa-file-text-o"></span><span class="title">Form</span>
                    </a>
                    Dropdown level 1
                    <div id="dropdown-form" class="panel-collapse collapse">
                        <div class="panel-body">
                            <ul class="nav navbar-nav">
                                <li><a href="form/ui-kits.html">Form UI Kits</a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </li>
                
                Dropdown
                <li class="panel panel-default dropdown">
                    <a data-toggle="collapse" href="#component-example">
                        <span class="icon fa fa-cubes"></span><span class="title">Components</span>
                    </a>
                    Dropdown level 1
                    <div id="component-example" class="panel-collapse collapse">
                        <div class="panel-body">
                            <ul class="nav navbar-nav">
                                <li><a href="components/pricing-table.html">Pricing Table</a>
                                </li>
                                <li><a href="components/chartjs.html">Chart.JS</a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </li>
                Dropdown
                <li class="panel panel-default dropdown">
                    <a data-toggle="collapse" href="#dropdown-example">
                        <span class="icon fa fa-slack"></span><span class="title">Page Example</span>
                    </a>
                    Dropdown level 1
                    <div id="dropdown-example" class="panel-collapse collapse">
                        <div class="panel-body">
                            <ul class="nav navbar-nav">
                                <li><a href="pages/login.html">Login</a>
                                </li>
                                <li><a href="pages/index.html">Landing Page</a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </li>
                Dropdown
                <li class="panel panel-default dropdown">
                    <a data-toggle="collapse" href="#dropdown-icon">
                        <span class="icon fa fa-archive"></span><span class="title">Icons</span>
                    </a>
                    Dropdown level 1
                    <div id="dropdown-icon" class="panel-collapse collapse">
                        <div class="panel-body">
                            <ul class="nav navbar-nav">
                                <li><a href="icons/glyphicons.html">Glyphicons</a>
                                </li>
                                <li><a href="icons/font-awesome.html">Font Awesomes</a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </li>
                <li>
                    <a href="license.html">
                        <span class="icon fa fa-thumbs-o-up"></span><span class="title">License</span>
                    </a>
                </li> -->
            </ul>
        </div>
        <!-- /.navbar-collapse -->
    </nav>
</div>
<script type="text/javascript" src="${cdn_url}/static/js/menu.js"></script>